<html>
	<head>
		<title>Persevere Examples</title>
		<script src="js/persevere.js"></script> <!-- include the persistence framework -->
		<link rel="stylesheet" type="text/css" href="examples/blog.css"/>
	</head>
	<body>
		<h1>Blog Example</h1>
		<a href="#" onclick="renderBlog()">Home</a>
		<div id="blogDiv"></div> <!-- we render the blog in this div -->
		<div id="newComment" style="display:none">
			<h3>Enter a new comment</h3>
			<div>
				Author:<input type="text" id="newCommentAuthor" />
			</div>
			<div>
				Comment:<textarea id="newCommentContent"></textarea>
			</div>
			<button onclick="addCommentEntry()">Submit Comment</button>
		</div>
		<a href="#" onclick="var style = document.getElementById('newPost').style; style.display=style.display=='block'?'none':'block'">New Post</a>
		<div id="newPost" style="display:none">
			<h3>Enter a new post</h3>
			<div>
				Content:<textarea id="newPostContent">new post</textarea>
			</div>
			<button onclick="addBlogPost()">Post</button>
		</div>
		<script>
			persevere.loadScript("examples/blog.pjs");
		</script>
	</body>
</html>